<template>
  <!-- 公司荣誉统计 -->
  <base-breadcrumb :title="$route.meta.title">
    <!-- 搜索 -->
    <searchData :searchData="searchArr" @search="search"></searchData>
    <!-- 表格 -->
    <a-card :bordered="false">
      <!-- <title-name :title="$route.meta.title"></title-name> -->
      <!-- 表格 -->
     <list-table
        ref="table"
        row-key="id"
        :columns="columns"
        :request="loadData"
        :alert="true"
      >
        <!-- 是否归还 -->
        <template slot="isBack" slot-scope="text">
          <span :class="{ del_btn: text == 0 }">{{ ['否', '是'][text] }}</span>
        </template>
        <!-- 操作 -->
        <template slot="action" slot-scope="text, record">
          <a @click="handleManage(record)">查看</a>
          <template v-if="record.isBack == 0 && position === 'COADAZG'">
            <a-divider v-btnPermission="'oa_004_ret_01'" type="vertical"></a-divider>
            <a v-btnPermission="'oa_004_ret_01'" @click="handleReturn(record)">归还</a>
          </template>
        </template>
      </list-table>
    </a-card>
  </base-breadcrumb>
</template>

<script>
// import { STable } from '@/components' // 表格
import { archives } from '@/api/office/office/enterpriseHonorAndImgCollect' // api
import SelectCompanyAndProject from '@/components/Select/SelectCompanyAndProject'
import BasePage from '@/views/basePage' // 基础配置
import OrgTreeSelect from '@/components/OrgTreeSelect/index'
const searchArr = [
  // 搜索框
  {
    name: '借阅单位',
    valueKey: 'searchQuery',
    type: OrgTreeSelect,
  },
  {
    name: '借阅内容',
    type: 'input',
    value: 'content',
  },
  {
    name: '借阅人',
    type: 'input',
    value: 'borrowingPersonName',
  },
  {
    name: '借阅日期',
    type: 'dateRange',
    value: 'time',
    attr: {
      rangeFormat: ['startDate', 'endDate'],
    },
  },
]
const columns = [
  {
    title: '序号',
    width: 80,
    dataIndex: 'index',
    customRender() {
      return arguments[2] + 1
    },
  },
  {
    title: '借阅单位',
    ellipsis: true,
    dataIndex: 'borrowingUnitName',
  },
  {
    title: '借阅人',
    ellipsis: true,
    dataIndex: 'borrowingPersonName',
  },
  {
    title: '借阅日期',
    ellipsis: true,
    dataIndex: 'borrowingTime',
  },
  {
    title: '借阅内容',
    ellipsis: true,
    dataIndex: 'content',
  },
  {
    title: '计划归还日期',
    ellipsis: true,
    dataIndex: 'planningBackTime',
  },
  {
    title: '是否已归还',
    dataIndex: 'isBack',
    width: '150px',
    scopedSlots: { customRender: 'isBack' },
  },
  {
    title: '实际归还日期',
    ellipsis: true,
    dataIndex: 'backTime',
    customRender() {
      return arguments[0] ?? '—'
    },
  },
  {
    title: '操作',
    dataIndex: 'action',
    width: '180px',
    align: 'center',
    scopedSlots: { customRender: 'action' },
  },
]
export default {
  name:'a'+Date.now(),
  extends: new BasePage(),
  components: {
    // STable,
  },
  data() {
    this.columns = columns
    this.searchArr = searchArr
    return {
      queryParam: {}, // 查询参数
      loadData: (parameter) => {
        const requestParameters = Object.assign({}, parameter, { query: { mark: 1, ...this.queryParam } })
        return archives.getList(requestParameters).then((res) => {
          return res
        })
      }, // 加载数据方法 必须为 Promise 对象
      form: {},
      position: '', // 岗位
    }
  },
  mounted() {
    this.position = this.$currentPost()?.postCode
  },
  methods: {
    /**
     * 搜索
     */
    search(value) {
      value && (this.queryParam = value)
      this.$refs.table.refresh(true)
    },
    /**
     * 归还
     */
    handleReturn(record) {
      let form = this.$clone(record)
      this.$confirm({
        title: '温馨提示',
        content: '确定归还？',
        onOk: () => {
          form.backTime = this.$dateFormat(new Date(), 'D')
          return archives.update(form).then(() => {
            this.$message.success('归还成功！')
            this.$refs.table.loadData()
          })
        },
      })
    },
    /**
     * 操作栏
     */
    handleManage(record) {
      let query = {
        archivesType: '1',
      }
      if (record && record.id) {
        query.id = record.id
      }
      this.$router.push({
        name: '/office/archivesBorrowingEdit',
        query,
      })
    },
  },
}
</script>
